<template>
  <div>
    <!--  第一部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log" style="height: 70px">
          <el-form :inline="true" :model="queryParam" class="demo-form-inline">
            <el-form-item label="身份证号" prop="patientCard">
              <el-input v-model="queryParam.patientCard" placeholder="请输入患者身份证号码" style="width: 500px"
                        clearable></el-input>
            </el-form-item>
            <el-form-item style="padding-left: 40px">
              <el-button type="primary" plain icon="el-icon-search" @click="handleQuery">加载身份证号</el-button>
              <el-button type="warning" plain icon="el-icon-zoom-in" @click="addPatient">加载患者信息</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
    </el-row>

    <!--  第二部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log">
          <el-form ref="queryList" :inline="true" :model="regList" class="demo-form-inline" :rules="rules">
            <el-form-item label="身份证号" required prop="patientCard">
              <el-input v-model="regList.patientCard" placeholder="患者身份证号码"></el-input>
            </el-form-item>
            <el-form-item label="患者姓名" required prop="patientName">
              <el-input v-model="regList.patientName" placeholder="患者姓名"></el-input>
            </el-form-item>
            <el-form-item label="患者电话" required prop="patientPhone">
              <el-input v-model="regList.patientPhone" placeholder="患者电话" value="regList.patientPhone"></el-input>
            </el-form-item>
            <el-form-item label="性别" prop="patientSex">
              <el-radio-group v-model="regList.patientSex">
                <el-radio label="男"></el-radio>
                <el-radio label="女"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="出生日期" prop="patientBirthday">
              <el-date-picker
                v-model="regList.patientBirthday"
                type="date"
                placeholder="选择日期"
                style="width: 150px">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="患者年龄" prop="patientAge">
              <el-input v-model="regList.patientAge" placeholder="患者年龄"></el-input>
            </el-form-item>
            <el-form-item label="地址信息" prop="patientAddr">
              <el-input v-model="regList.patientAddr" placeholder="地址信息" style="width: 600px"></el-input>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
    </el-row>

    <!--  第三部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log" style="height: 70px">
          <el-button-group v-model="regBut">

            <el-button v-for="(name,i) in registerName" :key="i" @click.native="addPrice(name)">{{name}}</el-button>
          </el-button-group>
          <span style="padding-left: 700px">
          挂号费:¥{{registerPrice}}
          <el-button type="danger" plain icon="el-icon-zoom-in" @click="insertRegister">挂号收费</el-button>
          </span>
        </el-card>
      </el-col>
    </el-row>

    <!--  第四部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log">
          <el-form :inline="true" :model="registerQuery" class="demo-form-inline">
            <el-form-item label="所属科室" prop="deptName">
              <el-select v-model="registerQuery.deptName" placeholder="所属科室" clearable>
                <el-option
                  v-for="dict in dict.type.sys_patinte_dept"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="挂号类型" prop="registerName">
              <el-select v-model="registerQuery.registerName" placeholder="挂号类型" clearable>
                <el-option
                  v-for="dict in dict.type.sys_register_name"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="挂号时段">
              <el-select v-model="registerQuery.timer" placeholder="时段选择" clearable>
                <el-option label="上午" value="上午"></el-option>
                <el-option label="下午" value="下午"></el-option>
                <el-option label="晚上" value="晚上"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="挂号时间" prop="date">
              <el-date-picker
                v-model="registerQuery.date"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                style="width: 150px"
                placeholder="选择日期"
                clearable></el-date-picker>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="onSubmit()">查询</el-button>
            </el-form-item>
          </el-form>
          <el-table  :data="registerList" :key="regglist">
            <el-table-column label="科室ID" align="center" prop="deptId"/>
            <el-table-column label="科室名称" align="center" prop="deptName"/>
            <el-table-column label="当前号数" align="center" prop="orderNum"/>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button type="success" @click="choice_confirm(scope.row)" plain>选择</el-button>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="total>0"
            :total="total"
            :page.sync="registerQuery.pageNum"
            :limit.sync="registerQuery.pageSize"
            @pagination="onSubmit"
          />
        </el-card>
      </el-col>
    </el-row>
  </div>

</template>

<script>
    import {getreg, delreg, addreg, updatereg, showName, all, deptId,addparams} from "@/api/vis/reg";

    export default {
        name: "index",
        dicts: ['sys_register_name', 'sys_patinte_dept'],
        data() {
            return {
                addparams:{
                  deptId:undefined,
                  patientName: undefined,
                   regName: undefined,
                },
                regglist: 0,
                loading: true,
                regList: {},//患者信息加载表
                regBut: {},
                registerName:
                    ["门诊", "急诊", "住院"]
                ,//看病类型加载表
                registerPrice: 0.0,//挂号费价格
                department: {},//科室加载列表
                typeid: '',
                dept: '',
                deptid: 0,
                registerQuery: {
                    pageNum: 1,
                    pageSize: 10,
                    deptName: undefined,
                    registerName: undefined,
                },//挂号单查询参数
                registerList: {},//挂号单数据查询
                pageList: {},//页面数据集合
                total: 0,//显示总条数
                queryParam: {
                    patientCard: undefined,
                    patientSex: 1
                },
                search: '',
                patientId: 0,
                // 表单校验
            }
        },

        //加载看病门诊类型与科室信息
        created() {
                all().then(res => {
                console.log(res);
                this.registerList = res;
                this.total = res.total;
                this.loading = false;
            })
        },

        methods: {

            //提示框
            remind(msg){

                this.$message({
                    message: msg,
                    type: 'success'
                });

            },
            handleQuery() {
                this.loading = false;
                getreg(this.queryParam.patientCard).then(res => {
                    this.regList = res.data;
                    this.patientCard = res.data.id;
                    this.addparams.patientName=res.data.patientName
                    this.open1(),
                        this.loading = false;
                })
            },

            open1() {
                this.$message({
                    message: '信息加载成功，请选择挂号类型',
                    type: 'success'
                });
            },
            open3() {
                this.$message({
                    message: '挂号成功',
                    type: 'success'
                });
            },

            //添加患者信息
            addPatient() {
                addreg(this.regList).then(res => {
                    if (res.msg === '操作成功') {
                        this.patientId = res.data;
                        this.open1();
                    }
                }).catch(() => {
                    this.reset();
                });
            },
            //表单重置
            reset() {
                this.form = {
                    patientCard: undefined,
                    patientName: undefined,
                    patientPhone: undefined,
                    patientSex: undefined,
                    patientBirthday: 0,
                    patientAge: 0,
                    patientAddr: undefined,
                };
                this.resetForm("queryList");
            },

            //获取挂号费价格
            addPrice(name) {
                this.addparams.regName=name
                showName(name).then(res => {

                    this.registerPrice = res
                })
            },

            onSubmit() {

                deptId(this.registerQuery.deptName).then(res => {
                    console.log(res.data);
                    this.registerList = res.data;
                    this.total = res.total;
                    console.log(this.registerList);
                     this.loading = false;
                    this.regglist=Math.random()

                })
            },

            insertRegister() {
                this.pageList.patientCard = this.patientCard;
                addparams(this.addparams).then(res =>{
                 if(res.code==200){
                     this.remind("挂号成功")

                     this.$router.push("/vis/show");
                 }
                })

            },

            choice_confirm(index) {
                console.log(index);
                this.addparams.deptId=index.deptId
                this.$confirm('是否选择挂该科室?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.dept = index.name;
                    this.deptid = index.id;
                    this.$message({
                        type: 'success',
                        message: '选择成功!请挂号'
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            }
        }
    }
</script>

<style scoped>

</style>
